<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新建订单界面</title>
    {% load static %}
    <!-- 引入 layui.css -->
    <link href="{%static '/css/layui.css'%}" rel="stylesheet">
    <link href="{%static '/css/font-awesome.min.css'%}" rel="stylesheet">
    <link href="{%static '/css/bootstrap.min.css'%}" rel="stylesheet">
</head>
<body>
<div class="layui-container">
    <div type="text-align:center;">
        <a href="javascript:;" class="layui-btn layui-btn-sm layui-btn-primary" data-content-href="order?type=self" data-title="自编处方" data-icon="fa fa-gears">自编处方</a>
        <a href="javascript:;" class="layui-btn layui-btn-sm " data-content-href="order" data-title="购药" data-icon="fa fa-gears">购药</a>
    </div>
    {%if self %}
            <!--        自我诊断的界面-->
            <script id="drugBar" type="text/html">
                <button type="button" class="layui-btn layui-btn-sm" id="assignbtn" lay-event="edit_event">
                    编辑
                </button>
                <button type="button" class="layui-btn layui-btn-sm" id="cancel_btn" lay-event="del_event">
                    删除
                </button>
            </script>
            <div class="layui-form">
                <input type="hidden" id="prescript_id" value="{{prescription_id}}" />
                <input type="hidden" id="drug_id" />
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">订单编号</label>
                        <div class="layui-input-inline layui-input-wrap">
                            <input type="text" name="OrderNo" id="OrderNo" value="{{OrderNum}}" lay-verify="required|phone" autocomplete="off" lay-reqtext="订单编号" class="layui-input layui-disabled" disabled/>
                        </div>
                        <label class="layui-form-label">开药日期</label>
                        <div class="layui-input-inline layui-input-wrap">
                            <input type="text" name="date" id="date1" autocomplete="off" lay-reqtext="开药日期" value="{{OrderDt}}" class="layui-input layui-disabled" disabled>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">药品</label>
                        <div class="layui-input-inline layui-input-wrap">
                            <select id="tablet_info" name="tablet_info" lay-verify="required" lay-reqtext="药品必填" lay-search>
                                <option value="">请选择药品</option>
                                {% for tablet_obj in tablet_info_list%}
                                <option value="{{tablet_obj.id}}">{{tablet_obj.tblt_nm}}</option>
                                {% endfor %}
                            </select>
                        </div>
                        <label class="layui-form-label">药品备注</label>
                        <div class="layui-input-inline layui-input-wrap">
                            <input type="text" name="MedNote" id="MedNote" autocomplete="off" lay-reqtext="请填写备注" lay-affix="clear" class="layui-input">
                        </div>
                        <label class="layui-form-label">药品规格</label>
                        <div class="layui-input-inline layui-input-wrap">
                            <input type="text" name="MedSpec" id="MedSpec" autocomplete="off" lay-reqtext="请填写药品规格" lay-affix="clear" class="layui-input">
                        </div>
                    </div>
                  </div>
                  <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">服药备注</label>
                        <div class="layui-input-inline layui-input-wrap">
                            <select id="drtscd" name="drtscd" lay-verify="required" lay-search>
                                <option value="">请选择</option>
                                <option value="饭前">饭前</option>
                                <option value="饭后">饭后</option>
                            </select>
                        </div>
                        <label class="layui-form-label">服药时间</label>
                        <div class="layui-input-inline layui-input-wrap">
                            <select id="doselist_time" name="doselist_time" lay-verify="required" lay-search>
                                <option value="">请选择</option>
                                <option value="0800">早</option>
                                <option value="1200">中</option>
                                <option value="1800">晚</option>
                                <option value="0800,1800">早晚</option>
                                <option value="0800,1200,1800">早中晚</option>
                            </select>

                        </div>
                        <label class="layui-form-label">服药剂量</label>
                        <div class="layui-input-inline layui-input-wrap">
                            <input type="number" name="doselist_dose" id="doselist_dose" autocomplete="off" lay-reqtext="请填写服药剂量" class="layui-input">
                        </div>
                    </div>
                  </div>
            </div>
            <button type="button" id="btn_save" class="layui-btn layui-btn-primary">保存</button>&nbsp;&nbsp;&nbsp;
            <button type="button" id="btn_cancel" class="layui-btn layui-btn-primary">取消</button>
        <table class="layui-table" style="height:full-150" id="infoDrug"></table>
    {% else %}
    <div class="layui-form layui-form-pane">
        <input type="hidden" id="order_id" />
        <table>
            <tr>
                <td>
                    <div class="layui-form-item">
                        <div class="layui-inline" pane>
                            <label class="layui-form-label">处方选择</label>
                            <div class="layui-input-inline layui-input-wrap">
                              <select id="prescription" name="prescription" lay-verify="required" lay-search lay-filter="prescription_select_filter">
                                    <option value="">请选择处方</option>
                                  {% if prescription_0_length > 0 %}
                                  <optgroup label="自编处方">
                                    {% for prescription_obj in prescription_0_list%}
                                    <option value="{{prescription_obj.id}}">{{prescription_obj.OrderNum}}</option>
                                    {% endfor %}
                                  </optgroup>
                                  {% endif %}
                                  {% if prescription_1_length > 0 %}
                                  <optgroup label="专业处方">
                                    {% for prescription_obj in prescription_1_list%}
                                    <option value="{{prescription_obj.id}}">{{prescription_obj.OrderNum}}</option>
                                    {% endfor %}
                                  </optgroup>
                                  {% endif %}
                              </select>
                            </div>
                        </div>
                        <div class="layui-inline" pane>
                            <label class="layui-form-label">付款方式</label>
                            <div class="layui-input-inline layui-input-wrap">
                              <select id="pay_type" name="pay_type" lay-verify="required" lay-search lay-filter="pay_type_select_filter">
                                    <option value="">请选择付款方式</option>
                                    <option value="wechat">微信</option>
                                    <option value="alipay">支付宝</option>
                              </select>
                            </div>
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <div class="layui-inline" pane>
                            <label class="layui-form-label">购药地点</label>
                            <div class="layui-input-inline layui-input-wrap">
                              <select id="rad" name="rad" lay-verify="required" lay-search>
                                    <option value="">请选择购药地点</option>
                                    {% for rad_obj in rad_list%}
                                    <option value="{{rad_obj.id}}">{{rad_obj.name}}{{rad_obj.place}}</option>
                                    {% endfor %}
                              </select>
                            </div>
                        </div>
                        <div class="layui-inline" pane>
                            <label class="layui-form-label">配送方式</label>
                            <div class="layui-input-inline layui-input-wrap">
                              <select id="pick_type" name="pick_type" lay-verify="required" lay-search>
                                    <option value="">请选择配送方式</option>
                                    <option value="自提">自提</option>
                                    <option value="顺丰">顺丰</option>
                              </select>
                            </div>
                        </div>
                    </div>
                </td>
                <td>
                    <img id="wechat" style="display:none;width:150px;height:150px;" src="{%static '/img/pay/'%}wechat.jpg" />

                    <img id="alipay" style="display:none;width:150px;height:150px;" src="{%static '/img/pay/'%}alipay.jpg" />
                </td>
            </tr>
        </table>

    </div>
    <button type="button" id="btn_save" class="layui-btn layui-btn-primary">购药</button>
    <table class="layui-table" style="height:full-150" id="infoTable"></table>
    {% endif %}
    <br/><br/>
</div>

<script id="colBar" type="text/html">
    <button type="button" class="layui-btn layui-btn-sm layui-btn-primary" id="assignbtn" lay-event="dispen_event">
        购药
    </button>
</script>
<!-- 引入 layui.js -->
<script src="{%static '/js/layui.min.js'%}" charset="utf-8"></script>
<script>
    layui.use(['layer','jquery','table','laydate','form'], function () {
        var $ = layui.jquery,
            layer = layui.layer,
            table = layui.table,
            laydate = layui.laydate,
            form = layui.form;
        // select 事件
        //
          form.on('select(prescription_select_filter)', function(data){
            var elem = data.elem;
            var value = data.value;
            var othis = data.othis;
            select_value = value;
            if(select_value==""){
                $("#wechat").hide();
                $("#alipay").hide();
            }
            else{
                var pay_type_options = $("#pay_type").val();
                $("#wechat").hide();
                $("#alipay").hide();
                if(pay_type_options=="wechat")
                {
                    $("#wechat").show();
                }

                if(pay_type_options=="alipay"){
                    $("#alipay").show();
                }
            }
          });

          form.on('select(pay_type_select_filter)', function(data){
            var elem = data.elem;
            var value = data.value;
            var othis = data.othis;
            select_value = value;

            var prescription_options = $("#prescription").val()
            $("#wechat").hide();
            $("#alipay").hide();
            if(prescription_options!=""){
                if(select_value=="wechat")
                {
                    $("#wechat").show();
                }

                if(select_value=="alipay"){
                    $("#alipay").show();
                }
            }

          });
<!--        保存按钮-->
        $("#btn_save").click(function(){
           var prescription_options = $("#prescription").val()
           var rad_options = $("#rad").val()
           var pick_type_options = $("#pick_type").val()
           if(prescription_options=="" || rad_options=="")
           {
               layer.msg("请选择处方和购药地点");
               return;
           }
           order_id = $("#order_id").val();
           if(order_id>0){
               layer.msg("执行保存操作")
           }
           else{
               $.ajax({
                   url:"/api/order/Order/",
                   type:"POST",
                   dataType:"json",
                   data:{
                       "prescription":prescription_options,
                       "rad":rad_options,
                       "order_date":'2024-03-21',
                       "pick_type":pick_type_options,
                       "staruser":{{user_id}}
                   },
                   success:function(data){
                       if(data.code="200"){
                           $("#drug_id").val("");
                           $("#tablet_info").val("");
                           $("#MedNote").val("");
                           $("#MedSpec").val("");
                           $("#drtscd").val("");
                           form.render('select')
                           table.reload('infoTable',function(){
                               page:{curr:1}
                           });
                       }
                   }
               });
           }
        });
        table.render({
           elem:"#infoTable",
           url:"/api/order/Order/?user_id={{user_id}}",
           height:'full-215',
           page:true,
           cols:[[
               {toolbar:'#colBar',title:"操作",width:100,fixed:'right'},
               {title:'序号',width:60,type:"numbers"},
               {field:'ordernum',title:"订单号" ,minWidth:100 },
               {field:'order_date',title:"订单日期" ,minWidth:100 },
               {field:'Prescription_Num',title:"处方号" ,minWidth:100 },
               {field:'rad_name',title:"购药地点",minWidth:100 },
               {field:'OrderStatus_name',title:"状态" },
               {field:'pick_type',title:"提货方式" },
           ]],
           //修改参数
           request:{
               "pageName":"pageNum",
               "limitName":"pageSize"
           },
           response:{
               statusName:'code',     //数据状态的字段名称，默认：codes
               countName: 'count',    //数据总数的字段名称，默认：count
               dataName:'data',       //数据列表的字段名称，默认：data
           },
           parseData:function(res){
               d = {
                   "code":0,
                   "count":res.data.count,
                   "data":res.data.results
               }
               return d
           }
        });
        table.on('tool(infoTable)',function(obj){
           if(obj.event == 'dispen_event'){
               order_obj = obj.data;
               if(order_obj.OrderStatus=="1"){
                   layer.msg("不允许重复购药");
               }
               else{
                   $.ajax({
                       url:"/api/prescription/create_rad_preceipt/",
                       type:"put",
                       dataType:"json",
                       data:{
                           "id":order_obj.id,
                       },
                       success:function(data){
                           if(data.code=="200"){
                               layer.msg(data.msg,{time:1*1000},function(){
                                   table.reload('infoTable',function(){
                                       page:{curr:1}
                                   });
                               });
                           }
                       }
                   });
               }
           }
        });
    });
</script>
</body>
</html>